import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import '../controller/theme_controller.dart';

class ThemePage extends StatelessWidget {
  final ThemeController themeController = Get.find();

  final List<Color> colors = [
    Colors.blue[100]!,
    Colors.red[600]!,
    Colors.green,
    Colors.purple,
    Colors.white,
    Colors.grey[200]!,
  ];

  ThemePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Redis'),
        systemOverlayStyle: SystemUiOverlayStyle(
          systemNavigationBarColor: Colors.transparent,
        ),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(
              () => Text(
                themeController.isDarkMode.value ? "当前：深色模式" : "当前：浅色模式",
                style: const TextStyle(fontSize: 20),
              ),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: () => themeController.toggleTheme(),
              child: const Text("切换浅/深色主题"),
            ),
            const SizedBox(height: 20),
            const Text("选择主色调："),
            const SizedBox(height: 10),
            Wrap(
              spacing: 10,
              children: colors
                  .map(
                    (color) => GestureDetector(
                      onTap: () => themeController.changePrimaryColor(color),
                      child: Container(
                        width: 40,
                        height: 40,
                        decoration: BoxDecoration(
                          color: color,
                          border: Border.all(color: Colors.white, width: 2),
                          shape: BoxShape.circle,
                        ),
                      ),
                    ),
                  )
                  .toList(),
            ),
          ],
        ),
      ),
    );
  }
}
